<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>

		<script src="js/vue.js"></script>

	</head>

	<body>
		<div id="app">

			<h1>{{msg2}}</h1>

			<hr />
			
			通过绑定父组件具有参数的方法。在子组件中调用父组件的传递的方法，传值。
			<com1 @fcom="getcom1data"></com1>

		</div>

		<template id="com1">
			<div>
				这是子组件；
				<input type="text" v-model="childmsg" />
				<button @click="myclick">向父组件传值</button>
			</div>
		</template>

		<script>
			var vm = new Vue({
				el: "#app",
				data: {
					msg: "父组件数据",
					msg2: ""
				},
				methods: {
					getcom1data(data) {
						this.msg2 = data
					}

				},
				components: {
					com1: {
						template: "#com1",
						data() {
							return {
								childmsg: "这是子组件的msg"
							}
						},
						methods: {
							myclick() {
								//调用父组件方法，并传递参数；
								this.$emit('fcom', this.childmsg)
							}
						}
					}
				}

			});
		</script>
	</body>

</html>